// flyLine
import * as Cesium from '@cesium/Source/Cesium.js';

function drawCanvas() {
  let canvas = document.createElement('canvas');
  canvas.width = 1000; //值越大，间距越小
  canvas.height = 10;
  let ctx = canvas.getContext('2d');
  let grd = ctx.createLinearGradient(0, 0, 50, 0);
  grd.addColorStop(0, "rgba(255,255,0,1)");
  grd.addColorStop(1, "rgba(255,255,0,0.25)");
  ctx.fillStyle = grd;
  ctx.fillRect(0, 0, 1000, 10);
  return canvas.toDataURL("image/png");
}

export default class PolylineTrailMaterialProperty {
  constructor(options) {
    options = Cesium.defaultValue(options, Cesium.defaultValue.EMPTY_OBJECT);
    this._definitionChanged = new Cesium.Event();
    this._color = undefined;
    this._colorSubscription = undefined;
    this.color = options.color;
    this.duration = options.duration;
    this.trailImage = options.trailImage;
    this._time = performance.now();
  }
}

Object.defineProperties(PolylineTrailMaterialProperty.prototype, {
  isConstant: {
    get: function() {
      return false;
    }
  },
  definitionChanged: {
    get: function() {
      return this._definitionChanged;
    }
  },
  color: Cesium.createPropertyDescriptor('color')
});

PolylineTrailMaterialProperty.prototype.getType = function(time) {
  return 'PolylineTrail';
}

PolylineTrailMaterialProperty.prototype.getValue = function(time, result) {
  if (!Cesium.defined(result)) {
    result = {};
  }

  result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color);
  result.image = Cesium.Material.PolylineTrailImage;
  // result.image = this.trailImage;
  result.time = ((performance.now() - this._time) % this.duration) / this.duration * (-1);
  return result;
}

PolylineTrailMaterialProperty.prototype.equals = function(other) {
  return this === other || (other instanceof PolylineTrailMaterialProperty && Cesium.Property.equals(this._color, other._color))
}

Cesium.Material.PolylineTrailType = 'PolylineTrail';
Cesium.Material.PolylineTrailImage = drawCanvas();
Cesium.Material.PolylineTrailSource = `czm_material czm_getMaterial(czm_materialInput materialInput){
    czm_material material = czm_getDefaultMaterial(materialInput);
    vec2 st = materialInput.st;
    vec4 colorImage = texture2D(image, vec2(fract(st.s - time), st.t));
    material.alpha = colorImage.a * color.a;
    material.diffuse = (colorImage.rgb + color.rgb) / 2.0;
    return material;
  }`;

Cesium.Material._materialCache.addMaterial(Cesium.Material.PolylineTrailType, {
  fabric: {
    type: Cesium.Material.PolylineTrailType,
    uniforms: {
      color: new Cesium.Color(0.0, 1.0, 0.0, 0.25),
      image: Cesium.Material.PolylineTrailImage,
      time: 10
    },
    source: Cesium.Material.PolylineTrailSource
  },

  translucent: function(material) {
    return true;
  }
});

// Cesium.PolylineTrailMaterialProperty = PolylineTrailMaterialProperty;
